import React, { FC } from "react";
import { Typography, Radio, Space } from "antd";
import { QuestionRadioPropsType, QuestionRadioDefaultProps } from "./interface";

const { Paragraph } = Typography;

const components: FC<QuestionRadioPropsType> = (
  props: QuestionRadioPropsType
) => {
  const { title, isVertical, options, value } = {
    ...QuestionRadioDefaultProps,
    ...props,
  };

  return (
    <div>
      <Paragraph strong>{title}</Paragraph>
      <Radio.Group value={value}>
        <Space direction={isVertical ? "vertical" : "horizontal"}>
          {options.map((option, index) => (
            <Radio value={option.value} key={index}>
              {option.text}{" "}
            </Radio>
          ))}
        </Space>
      </Radio.Group>
    </div>
  );
};

export default components;
